<template>
  <div class="app-container"
       v-loading="loading"
       element-loading-text="加载中"
       element-loading-spinner="el-icon-loading"
       element-loading-background="rgba(0, 0, 0, 0.6)">

    <!--猪场信息模块-->
    <div class="title">
      <div class="left"><span class="circle"></span>猪场信息</div>
      <div class="right">
        <el-button type="primary" size="small"
                   v-if="taskDistributeBtnStatus"
                   @click="taskDistributeStatus=true">任务分配</el-button>
      </div>
      <div class="right" v-show="!isDisabled">
        <el-button type="primary" size="small" @click="handelSaveFn('0')">暂存</el-button>
        <el-button size="small" @click="handelSaveFn('1')">提交</el-button>
      </div>
    </div>
    <div class="context-warp" style="">
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>片区</span>
        </label>
        <div class="page-form-item-content"
             style="position: relative;z-index: 1;height: auto;line-height: 36px;overflow: unset;">
          <treeselect v-model="topData.deptId" :disabled=" !(pageType === 'add') " :options="deptOptions"
                      :show-count="true" placeholder="请选择片区"
                      @select="handelDept"
                      style="position: absolute;width:96%;left: 2%;top: 7px;z-index: 10000000;"/>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>猪场名称</span>
        </label>
        <div class="page-form-item-content">
          <span v-if="pageType != 'add'">
          </span>
          <zb-form-select-data v-bind="option" :disabled="pageType != 'add'" v-model="topData.pigfarmInfo.pigfarmName"
                               @dataChange></zb-form-select-data>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">猪场编码</span>
        </label>
        <div class="page-form-item-content">
          <span v-if="pageType != 'add'">
            {{topData.pigfarmInfo.pigfarmNumber}}
          </span>
          <span v-else>
            {{topData.pigfarmNumber}}
          </span>
        </div>
      </div>

      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">建设类型</span>
        </label>
        <div class="page-form-item-content">
          <span v-if="pageType != 'add'">
            <span v-show="topData.pigfarmInfo.buildType == '1'">楼房猪场</span>
            <span v-show="topData.pigfarmInfo.buildType == '2'">平房猪场</span>
          </span>
          <span v-else>
            <span v-show="topData.buildType == '1'">楼房猪场</span>
            <span v-show="topData.buildType == '2'">平房猪场</span>
          </span>


        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">猪场类型</span>
        </label>
        <div class="page-form-item-content">

          <span v-if="pageType != 'add'">
            <span v-show="topData.pigfarmInfo.pigfarmType == '1'">繁殖场</span>
            <span v-show="topData.pigfarmInfo.pigfarmType == '2'">育肥场</span>
            <span v-show="topData.pigfarmInfo.pigfarmType == '3'">租赁代养场</span>
            <span v-show="topData.pigfarmInfo.pigfarmType == '4'">种猪场</span>
            <span v-show="topData.pigfarmInfo.pigfarmType == '5'">自养小区</span>
            <span v-show="topData.pigfarmInfo.pigfarmType == '6'">租赁繁殖场</span>
            <span v-show="topData.pigfarmInfo.pigfarmType == '7'">公猪站</span>
          </span>
          <span v-else>
            <span v-show="topData.pigfarmType == '1'">繁殖场</span>
            <span v-show="topData.pigfarmType == '2'">育肥场</span>
            <span v-show="topData.pigfarmType == '3'">租赁代养场</span>
            <span v-show="topData.pigfarmType == '4'">种猪场</span>
            <span v-show="topData.pigfarmType == '5'">自养小区</span>
            <span v-show="topData.pigfarmType == '6'">租赁繁殖场</span>
            <span v-show="topData.pigfarmType == '7'">公猪站</span>
          </span>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">规模(头)</span>
        </label>
        <div class="page-form-item-content">
          <span v-if="pageType != 'add'">
            {{topData.pigfarmInfo.scale}}
          </span>
          <span v-else>
            {{topData.scale}}
          </span>
        </div>
      </div>

      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">所在公司</span>
        </label>
        <div class="page-form-item-content">
          <span v-if="pageType != 'add'">
            {{topData.pigfarmInfo.companyName}}
          </span>
          <span v-else>
            {{topData.companyName}}
          </span>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">猪场地址</span>
        </label>
        <div class="page-form-item-content">
          <span v-if="pageType != 'add'">
            {{topData.pigfarmInfo.address}}
          </span>
          <span v-else>
            {{topData.address}}
          </span>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">资产属性</span>
        </label>
        <div class="page-form-item-content">
          <span v-if="pageType != 'add'">
            {{topData.pigfarmInfo.propertyType | propertyTypeName}}
          </span>
          <span v-else>
            {{topData.propertyType | propertyTypeName}}
          </span>
        </div>
      </div>

    </div>
    <!--猪场信息模块-->


    <!--立项信息模块-->
    <div class="title" style="border-bottom:none;margin-bottom:0;">
      <div class="left"><span class="circle"></span>立项信息</div>
      <div class="right" v-show="!isDisabled">
      </div>
    </div>
    <div class="context-warp" style=" overflow: hidden;">
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">项目编码</span>
        </label>
        <div class="page-form-item-content">
          {{topData.projectNumber}}
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>项目名称</span>
        </label>
        <div class="page-form-item-content">
          <el-input type="text" v-model="topData.projectName" :disabled="isDisabled" size="small" maxlength="100"
                    placeholder="请输入项目名称"></el-input>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>项目经理</span>
        </label>
        <div class="page-form-item-content">
          <loadingSearchFormPerson
            v-bind:projectManagerName="topData.projectManagerName"
            v-on:changeCom="changeCom($event)"
            :isDisabled="isDisabled"
          />
        </div>
      </div>

      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">标题</span>
        </label>
        <div class="page-form-item-content">
          {{topData.projectName}}立项申请
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>计划开始</span>
        </label>
        <div class="page-form-item-content">
          <el-date-picker
            :disabled="isDisabled"
            size="small"
            v-model="topData.beginTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请填时间"
          ></el-date-picker>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>计划结束</span>
        </label>
        <div class="page-form-item-content">
          <el-date-picker
            :disabled="isDisabled"
            size="small"
            v-model="topData.endTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请填时间"
          ></el-date-picker>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text">建设周期(天)</span>
        </label>
        <div class="page-form-item-content">
          <el-input type="number" v-model="topData.buildDay"
                    disabled size="small" maxlength="100"
                    placeholder="请输入建设周期"></el-input>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>概算金额(元)</span>
        </label>
        <div class="page-form-item-content">
          <!-- <el-input type="text" v-model="topData.estimatedAmount" :disabled="isDisabled" size="small" maxlength="10" placeholder="请输入概算金额"></el-input> -->
          <el-input type="number" v-model="topData.estimatedAmount"
                    :disabled="isDisabled" size="small" maxlength="100"
                    oninput="if(value>999999999)value=999999999;value = Number(value.toString().match(/^\d+(?:\.\d{0,2})?/));"
                    placeholder="请输入概算金额"></el-input>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>出资方</span>
        </label>
        <div class="page-form-item-content">
          <el-select v-model="topData.buildParty" :disabled="isDisabled" size="small" placeholder="请选择">
            <el-option label="正邦出资" value="1"></el-option>
            <el-option label="代建方出资" value="2"></el-option>
            <el-option label="出租方出资" value="3"></el-option>

          </el-select>
        </div>
      </div>
      <div class="page-form-item" style="height:50px">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>立项类型</span>
        </label>
        <div class="page-form-item-content">
          <el-select v-model="topData.projectBuildType" :disabled="isDisabled" size="small" placeholder="请选择立项类型"
                     clearable>
            <el-option label="猪场技改" value="1"></el-option>
            <el-option label="环保技改" value="2"></el-option>
            <el-option label="未批先建" value="3"></el-option>
            <el-option label="数据补录" value="4"></el-option>
          </el-select>
        </div>
      </div>
      <div class="page-form-item page-form-item2" style="height:50px;">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"></span>
        </label>
        <div class="page-form-item-content">

        </div>
      </div>

      <div class="page-form-item page-form-item3" style="height:100px;">
        <label class="page-form-item-label">
          <span class="page-form-item-label__text"><span style="color:red">*</span>项目描述</span>
        </label>
        <div class="page-form-item-content">
          <el-input type="textarea" v-model="topData.remark" :disabled="isDisabled" size="small" maxlength="500"
                    placeholder="请输入项目描述"></el-input>
        </div>
      </div>
    </div>
    <!--立项信息模块-->

    <!-- 附件模块-->
    <div class="title" style="border-bottom:none;margin-bottom:0;">
      <div class="left"><span class="circle"></span>附件</div>
    </div>
    <div class="context-warp" style=" overflow: hidden;">
      <div class="my-table">
        <div class="table-head">
          <div class="td">序号</div>
          <div class="td">附件类型</div>
          <div class="td">附件名称</div>
        </div>
        <div class="table-tr">
          <div class="td">1</div>
          <div class="td"><span style="color:red" v-if="topData.projectBuildType==1||topData.projectBuildType==2">*</span>航拍图</div>
          <div class="td">
            <FileUpload v-model='topData.fileList2' :limit="3" :disabled="isDisabled"/>
          </div>
        </div>
        <div class="table-tr">
          <div class="td">2</div>
          <div class="td"><span style="color:red" v-if="topData.projectBuildType==1||topData.projectBuildType==2">*</span>五区五流规划图</div>
          <div class="td">
            <FileUpload v-model='topData.fileList3' :limit="3" :disabled="isDisabled"/>
          </div>
        </div>
        <div class="table-tr">
          <div class="td">3</div>
          <div class="td"><span style="color:red" v-if="topData.projectBuildType==1||topData.projectBuildType==2">*</span>会议纪要 <span style="color: red;">(整体立项会议纪要签字版扫描件)</span></div>
          <div class="td">
            <FileUpload v-model='topData.fileList4' :limit="3" :disabled="isDisabled"/>
          </div>
        </div>
        <div class="table-tr">
          <div class="td">4</div>
          <div class="td"><span style="color:red" v-if="topData.projectBuildType==1||topData.projectBuildType==2">*</span>概算文件</div>
          <div class="td">
            <FileUpload v-model='topData.fileList5' :limit="3" :disabled="isDisabled"/>
          </div>
        </div>
        <div class="table-tr">
          <div class="td">5</div>
          <div class="td">其他附件</div>
          <div class="td">
            <FileUpload v-model='topData.fileList1' :limit="3" :disabled="isDisabled"/>
          </div>
        </div>
      </div>
    </div>
    <!-- 附件模块-->

    <!--技改需求明细表模块-->
    <div class="title" style="border-bottom:none;margin-bottom:0;">
      <div class="left">
        <span class="circle"></span>
        <span style="color:red" v-if="topData.projectBuildType==1||topData.projectBuildType==2">*</span>技改需求明细表
      </div>
      <div class="right" v-show="!isDisabled">
        <el-button type="primary" size="small" @click="handelAddFn">新增</el-button>
      </div>
    </div>
    <div class="context-warp" style=" overflow: hidden;">
      <el-table :data="pigfarmProjectDemandList" border>
        <el-table-column label="场区" prop="deptName" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <el-select size="small" style="width:100%" v-model="scope.row.areaDictId" :disabled="isDisabled"
                       placeholder="请选择">
              <el-option
                v-for="item in areaList"
                :key="item.value"
                :label="item.value"
                :value="item.id">
              </el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column label="单体" prop="deptName" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <el-input size="small" v-model="scope.row.nodeName" :disabled="isDisabled" maxlength="30"
                      placeholder="请输入内容"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="改造需求" prop="deptName" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <el-input size="small" v-model="scope.row.remark" :disabled="isDisabled" maxlength="30"
                      placeholder="请输入内容"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="改造前照片" prop="deptName" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <FileUpload v-model='scope.row.fileList1' :limit="3" :disabled="isDisabled"/>
          </template>
        </el-table-column>


        <el-table-column
          align="center"
          width="120px"
          fixed="right"
          label="操作">
          <template slot-scope="scope">
            <el-button
              v-show="!scope.row.id"
              size="mini"
              type="text"
              @click="handleDelete(scope.$index)"
            >删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!--技改需求明细表模块-->

    <!--任务分配窗口模块-->
    <el-dialog title="任务分配" :visible.sync="taskDistributeStatus" width="400px">
      <el-form :model="taskDistributeForm" label-width="80px">
        <el-form-item label="设计人员">
          <zb-form-select-data v-bind="dutyOptions" v-model="taskDistributeForm.dealName" @dataChange="handleDesignLeaderChange"></zb-form-select-data>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="taskDistributeStatus = false">取 消</el-button>
        <el-button type="primary" @click="handleConfirmClick">确 定</el-button>
      </div>
    </el-dialog>
    <!--任务分配窗口模块-->

  </div>
</template>

<script>
  import moment from 'moment'
  import {
    getTreeselect,
    addFarmInfo,
    updateFarmInfo,
    getDetailsById,
    listSelct,
    getDictList,
    getTaskDistributeBtnById,
    setTaskDistributeApi
  } from "@/api/projectManagement/initiation";
  import {makePy} from "@/utils/makePy";
  import {newWindowBpm} from "@/utils/openBpm";
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  import BaseIndex from '@/views/base/BaseIndex'
  import FileUpload from '@/views/components/fileUpload/index.vue'
  import loadingSearchFormPerson from '@/views/components/loadingSearchFormPerson/index.vue'
  import {getToken} from "@/utils/auth";

  export default {
    name: "InitiationDetails",
    components: {Treeselect, FileUpload, loadingSearchFormPerson},
    extends: BaseIndex,
    data() {
      return {
        taskDistributeBtnStatus:true,//是否显示任务分配按钮(审批完成状态 &&(当前登录人=设计组长 || 调用/design-info/complete接口返回true))
        taskDistributeStatus:false,//任务分配窗口显隐状态
        taskDistributeForm:{dealOa:"", dealName:""},//任务分配窗口表单
        //系统用户配置
        dutyOptions: {
          label: "责任人",
          prop: "nameCn",
          type: "selectData",
          searchKey: "nameCn",
          span: 12,
          url: `${process.env.VUE_APP_BASE_API}/common/list`,
          props: {
            label: "nameCn",
            value: "account"
          },
          height: 62,
          createdRequest: false,
          searchIconVisible: true,
          filterAble: false,
          getDictSuccessStatus: 0,
          getDictResultMap: {
            status: 'data.code',
            data: 'data.data',
            list: 'data.data.records',
            total: 'data.data.total',
          },
          method: 'post',
          dialogType: 2,
          labelFields: ['nameCn', 'account', 'deptName'],
          labelFieldsName: ['用户名', '账户', '所属部门'],
          searchLabel: ['nameCn'],
          searchLabelName: ['用户名'],
          headers: {
            Authorization: 'Bearer ' + getToken()
          },
        },


        loading: false,
        pageType: '',//add新增  change修改  details详情
        isDisabled: false,
        deptOptions: undefined,
        props: {
          value: 'id',
          label: 'label'
        },
        option: {
          label: "猪场名称",
          prop: "pigfarmName",
          type: "selectData",
          /*subType:"cascade",*/
          searchKey: "pigfarmName",
          span: 8,
          url: `${process.env.VUE_APP_BASE_API}/pigfarm-info/listSelct`,
          params: {
            deptId: '',
            pageNum: 1,
            pageSize: 5
          },
          props: {
            label: "pigfarmName",
            value: "id"
          },
          createdRequest: false,
          searchIconVisible: true,
          filterAble: false,
          selectAble: true,
          getDictSuccessStatus: 0,
          getDictResultMap: {
            status: 'data.code',
            data: 'data.data',
            list: 'data.data.records',
            total: 'data.data.total',
          },
          dialogType: 2,
          labelFields: ['pigfarmName', 'pigfarmNumber', 'companyName', 'address'],
          labelFieldsName: ['猪场名称', '猪场编号', '所在公司', '猪场地址'],
          searchLabel: ['pigfarmName'],
          searchLabelName: ['猪场名称'],
          headers: {
            Authorization: 'Bearer ' + getToken()
          },
          listeners: {
            dataChange: val => {
              if (val) {
                const {id, pigfarmName, pigfarmNumber, buildType, pigfarmType, scale, companyName, address, propertyType} = val;
                this.topData.pigfarmId = id;
                this.topData.pigfarmName = pigfarmName;
                this.topData.pigfarmNumber = pigfarmNumber;
                this.topData.buildType = buildType;
                this.topData.pigfarmType = pigfarmType;
                this.topData.scale = scale;
                this.topData.companyName = companyName;
                this.topData.address = address;
                this.topData.propertyType = propertyType;
                this.topData.projectNumber = this.topData.pigfarmNumber + moment().format('YYYYMMDDHHmmss');
              }
            }
          }
        },
        topData: {
          pigfarmNumber: '',
          deptId: undefined,
          buildDay: 0,
          pigfarmInfo: {},
          fileList1: [],
          fileList2: [],
          fileList3: [],
          fileList4: [],
          fileList5: [],
        },
        pigfarmList: [],
        pigfarmProjectDemandList: [],
        areaList: [],
      };
    },
    filters: {
      propertyTypeName(val) {
        if (val == 1) return '自建场'
        if (val == 2) return '代建场'
        if (val == 3) return '租赁场'
        return ''
      }
    },
    watch: {
      topData: {
        handler(val) {
          if (val.beginTime && val.endTime) {
            val.buildDay =
              Math.floor(
                (parseInt(new Date(val.endTime).getTime()) -
                  parseInt(new Date(val.beginTime).getTime())) /
                (24 * 3600 * 1000)
              ) + 1;
          } else {
            val.buildDay = 0;
          }
        },
        deep: true
      }
    },
    created() {

      getDictList().then(
        response => {
          if (response && response.code === 0) {
            this.areaList = response.data
          } else {
            this.msgError(response.msg)
          }
          this.loading = false;
        }
      );

      const { type } = this.$route.query;
      this.pageType = type;
      if(type === "add"){
        this.taskDistributeBtnStatus = false;//新增屏蔽任务分配按钮
      }

      if (this.$route.query.type == 'add') {
      }

      if (this.$route.query.type == 'details' || this.$route.query.type == 'change') {

        if (this.$route.query.type == 'details') {
          this.isDisabled = true;
        }
        if (this.$route.query.type == 'change') {
          this.isDisabled = false;
        }

        getDetailsById(this.$route.query.id).then(
          response => {
            if (response && response.code === 0) {
              this.topData = {...response.data}
              if (response.data.pigfarmProjectDemandList == null) {
                response.data.pigfarmProjectDemandList == []
              }
              this.pigfarmProjectDemandList = response.data.pigfarmProjectDemandList;
              this.getTaskDistributeBtnPermission();//获取任务分配按钮权限
            } else {
              this.msgError(response.msg)
            }
            this.loading = false;
          }
        );
      }


      /**
       * 获取片区树形结构
       */
      getTreeselect().then(
        response => {
          if (response && response.code === 0) {
            this.deptOptions = response.data
          } else {
            this.msgError(response.msg)
          }
          this.loading = false;
        }
      );
    },
    methods: {

      /**
       *获取任务分配按钮权限
       */
      getTaskDistributeBtnPermission(){
        const { id } = this.$route.query;
        getTaskDistributeBtnById(id).then(res => {
          //debugger
          if(res.code === 0){
            const { status, designLeader } = this.topData;
            const { account } = this.$store.getters;
            //debugger
            if(status==="completed" && !res.data && (designLeader===account || account==='admin')  ){
              this.taskDistributeBtnStatus = true;
            }else{
              this.taskDistributeBtnStatus = false;
            }
          }else{
            this.$message.error(res.msg);
          }
        }).catch(error => {
          console.log(error);
        })
      },

      /**
       *二次设计组长选择事件
       * @param val
       */
      handleDesignLeaderChange(val){
        console.log(val);
        const { account, nameCn } = val;
        //debugger
        this.taskDistributeForm.dealOa = account;
        this.taskDistributeForm.dealName = nameCn;
      },


      /**
       * 分配任务窗口确认事件
       */
      handleConfirmClick() {
        const { dealOa, dealName } = this.taskDistributeForm;
        const { id } = this.$route.query;
        if(!dealOa){
          this.$message.warning("请选择设计人员");
        }else{
          const loading = this.$loading({lock: true, text: 'Loading', spinner: 'el-icon-loading', background: 'rgba(0, 0, 0, 0.7)'});
          //debugger;
          setTaskDistributeApi(id,dealOa,dealName).then(res => {
            loading.close();
            if(res.code===0){
              this.$message.success("分配成功");
              this.taskDistributeStatus = false;
            }else{
              this.$message.error(res.msg);
            }
          }).catch(err => {
            console.log(err);
            loading.close();
          })
        }
      },



      handleDelete(e) {
        this.pigfarmProjectDemandList.splice(e, 1);
      },

      handelAddFn() {
        this.pigfarmProjectDemandList.push({fileList1: []})
      },

      changeCom(e) {

        this.topData.projectManagerName = e.name
        this.topData.projectManagerOa = e.id
      },
      makePy,
      handelChosePigfarm(e) {
        // console.log(e)
        for (let index = 0; index < this.pigfarmList.length; index++) {
          if (this.pigfarmList[index].id == e) {
            // console.log(this.pigfarmList[index])
            this.topData.pigfarmNumber = this.pigfarmList[index].pigfarmNumber;
            this.topData.buildType = this.pigfarmList[index].buildType;
            this.topData.pigfarmType = this.pigfarmList[index].pigfarmType;
            this.topData.scale = this.pigfarmList[index].scale;
            this.topData.companyName = this.pigfarmList[index].companyName;
            this.topData.address = this.pigfarmList[index].address;
            this.topData.propertyType = this.pigfarmList[index].propertyType;
            this.topData.projectNumber = this.topData.pigfarmNumber + moment().format('YYYYMMDDHHmmss');
          }
        }
      },
      handelDept(e) {
        this.option.params.deptId = e.id;
        /*listSelct(e).then(
          response => {
            if(response && response.code ===0){
              this.pigfarmList = response.data
            }else{
              this.msgError(response.msg)
            }
            this.loading = false;
          }
        );*/
      },
      handelpigfarmName(e) {
        let arr = this.makePy(e)
        // this.topData.pigfarmNumber = arr[0]
      },


      handelSaveFn(e) {
        if (this.$route.query.type == 'change') {
          if (!this.topData.pigfarmInfo.deptId) {
            this.msgError('请填写 片区');
            return false;
          }
        } else {
          if (!this.topData.deptId) {
            this.msgError('请填写 片区');
            return false;
          }
        }
        if (!this.topData.pigfarmId) {
          this.msgError('请填写 猪场名称');
          return false;
        }
        if (!this.topData.projectName) {
          this.msgError('请填写 项目名称');
          return false;
        }
        if (!this.topData.projectManagerName) {
          this.msgError('请填写 项目经理');
          return false;
        }
        if (!this.topData.beginTime) {
          this.msgError('请填写 计划开始');
          return false;
        }
        if (!this.topData.endTime) {
          this.msgError('请填写 计划结束');
          return false;
        }
        if (!this.topData.estimatedAmount && this.topData.estimatedAmount != 0) {
          this.msgError('请填写 概算金额');
          return false;
        }
        if (!this.topData.buildParty) {
          this.msgError('请填写 出资方');
          return false;
        }

        if (!this.topData.projectBuildType) {
          this.msgError('请填写 立项类型');
          return false;
        }

        if (!this.topData.remark) {
          this.msgError('请填写 项目描述');
          return false;
        }


        // 立项类型 为 未批先建 或 数据补录 类型时，1.附件和技改需求明细表为非必填，2.审批通过后不推送设计待办和预算代办
        if (this.topData.projectBuildType!=3 && this.topData.projectBuildType!=4){

          // if(!this.topData.fileList1.length) {this.msgError('请填写 其他附件'); return false;}
          if (!this.topData.fileList2.length) {
            this.msgError('请上传 航拍图');
            return false;
          }
          if (!this.topData.fileList3.length) {
            this.msgError('请上传 五区五流规划图');
            return false;
          }
          if (!this.topData.fileList4.length) {
            this.msgError('请上传 会议纪要');
            return false;
          }
          if (!this.topData.fileList5.length) {
            this.msgError('请上传 概算文件');
            return false;
          }

          if (!this.pigfarmProjectDemandList.length) {
            this.msgError('请填写 技改需求明细表');
            return false;
          }

          for (let index = 0; index < this.pigfarmProjectDemandList.length; index++) {
            const element = this.pigfarmProjectDemandList[index];

            if (!element.areaDictId) {
              this.msgError('请填写 完整填写 技改需求明细表 场区');
              return false;
            }
            if (!element.nodeName) {
              this.msgError('请填写 完整填写 技改需求明细表 单体');
              return false;
            }
            if (!element.remark) {
              this.msgError('请填写 完整填写 技改需求明细表 改造需求');
              return false;
            }
            if (!element.fileList1.length) {
              this.msgError('请填写 完整填写 技改需求明细表 改造前照片');
              return false;
            }

          }
        }



        var para = {
          ...this.topData,
          pigfarmProjectDemandList: this.pigfarmProjectDemandList,
          status: e,
          // fileList:this.fileList
        }
        this.loading = true;
        if (this.$route.query.type == 'change') {
          updateFarmInfo(para).then(
            response => {
              if (response && response.code === 0) {
                // this.zoneList = response.data
                // this.msgSuccess("成功");
                if (e == '0') {
                  this.msgSuccess("成功");
                  this.$router.go(-1)
                }
                if (e == '1') {
                  newWindowBpm(response.data.instId)
                }
                // this.$router.go(-1)
              } else {
                this.msgError(response.msg)
              }
              this.loading = false;
            }
          ).catch((err) => {
            this.loading = false;
          })
        } else {
          addFarmInfo(para).then(
            response => {
              if (response && response.code === 0) {
                if (e == '0') {
                  this.msgSuccess("成功");
                  this.$router.go(-1)
                }
                if (e == '1') {
                  newWindowBpm(response.data.instId)
                }
              } else {
                this.msgError(response.msg)
              }
              this.loading = false;
            }
          ).catch((err) => {
            this.loading = false;
          })
        }
      },


      handleSubCat(e) {
        console.log(e[1])
        this.topData.deptId = e[1]
      },
    }
  };
</script>
<style lang="scss">
  .title {
    display: flex;
    justify-content: space-between;
    padding: 0 0.9375rem 0.9375rem 0.9375rem;
    // padding: 0 0.9375rem 0 0.9375rem;
    background-color: white;
    // border-bottom: 2px solid #ccc ;
    .circle {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      display: inline-block;
      background-color: #4A75D0;
      margin-right: 10px;
    }
  }

  .context-warp {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 15px;
    margin: 15px;
    border-bottom: 1px solid #ebeef3;
    border-right: 1px solid #ebeef3;
    background-color: white;

    .page-form-item {
      width: 33.3%;
      font-size: 14px;
      font-family: "PingFangSC";
      position: relative;
      border-top: 1px solid #ebeef3;
      vertical-align: top;
      height: 66px;
      color: #4d4d4d;
      display: flex;

      .page-form-item-label {
        width: 120px;
        height: 100%;

        .icon {
          color: red;
        }
      }

      .left-border {
        position: absolute;
        height: 100%;
        width: 1px;
        left: 0;
        top: 0;
        background-color: #ebeef3;
        z-index: 999;
      }

      &-label {
        display: inline-block;
        height: calc(100% - 16px);
        background-color: #f9fafd;
        border-right: 1px solid #ebeef3;
        border-left: 1px solid #ebeef3;
        text-align: center;

        .require {
          display: inline-block;
          width: 8px;
          color: #f56c6c;
          vertical-align: -3px;
        }

        &__text {
          display: inline-block;
          vertical-align: middle;
          line-height: 1.3em;
          width: 80%;
        }

        &::after {
          content: "";
          display: inline-block;
          vertical-align: middle;
          height: 100%;
        }
      }

      .border-right0 {
        border-right: 0;
      }

      &-content {
        display: inline-block;
        vertical-align: top;
        padding: 8px;
        height: calc(100% - 16px);

        &.noLabel {
          border-left: 1px solid #ebeef3;
        }

        &::after {
          content: "";
          display: inline-block;
          vertical-align: middle;
          height: 100%;
        }

        &.align-top {
          &::after {
            content: "";
            vertical-align: top;
          }
        }

        &.noPadding {
          padding: 0;
        }
      }

      .el-table th {
        background-color: #f9fafd;
      }

      .el-radio {
        margin-right: 15px;
      }

      .el-radio__label {
        font-size: 12px;
      }

      .el-input--small .el-input__inner {
        font-size: 12px;
      }

      .el-checkbox {
        font-size: 12px;
      }

      .el-checkbox__label {
        font-size: 12px;
        vertical-align: -2px;
      }

      .el-select {
        width: 100%;
      }

      .el-cascader {
        width: 100%;
      }

      .el-date-editor.el-input,
      .el-date-editor.el-input__inner {
        width: 100%;
      }

      .el-textarea__inner {
        height: 80px;
      }

      .page-form-item-content {
        height: 100%;
        flex: 1;
        display: flex;
        align-items: center;
        word-break: break-all;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 14px;

        .text-box {
          height: 100%;
          display: flex;
          justify-content: center;
          align-items: center;
          overflow: hidden;
          cursor: pointer;


        }

        .slider-box {
          display: flex;
          justify-content: space-between;

          &:first-child {
            flex: 1;
          }
        }
      }
    }

    .page-form-item2 {
      width: 50%;
    }

    .page-form-item3 {
      width: 100%;
    }

    .page-form-item32 {
      width: 66.6%;
    }


    .my-table {
      width: 100%;
      border: 1px solid #dfe6ec;

      .table-head {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;

        &:last-child {
          .td {
            border-bottom: none;
          }
        }

        .td {
          height: 40px;
          padding: 0 10px;
          border-bottom: 1px solid #dfe6ec;
          border-right: 1px solid #dfe6ec;
          box-sizing: border-box;

          &:nth-child(1) {
            width: 55px !important;
          }

          &:nth-child(2) {
            width: 260px !important;
          }

          &:nth-child(3) {
            border-right: none;
            flex: 4;
          }
        }
      }

      .table-head {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        background-color: #f8f8f9;

        .td {
          line-height: 40px;
          font-size: 13px;
          color: #4d4d4d;
          font-weight: 600;
        }
      }

      .table-tr {
        position: relative;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        border-bottom: 1px solid #dfe6ec;
        overflow: hidden;

        &:last-child {
          border-bottom: none;
        }

        .td {
          padding: 0 0;
          font-size: 12px;
          color: #606266;
          box-sizing: border-box;
          float: left;

          &:nth-child(1) {
            position: absolute;
            left: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 55px !important;
            height: 100%;
          }

          &:nth-child(2) {
            position: absolute;
            left: 55px;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 260px !important;
            height: 100%;
            overflow: hidden;
            border-left: 1px solid #dfe6ec;
          }

          &:nth-child(3) {
            margin-left: 315px;
            flex: 4;
            height: auto;
            padding: 10px;
            border-left: 1px solid #dfe6ec;
          }
        }
      }
    }
  }
</style>
